<style>
    #images-group img{
        width: 100%;
    }
</style>
<div class="layui-form" lay-filter="layuiadmin-app-form-list" id="layuiadmin-app-form-list"style="padding: 20px 30px 0 0;">

    <div class="layui-col-md12">
        <script type="text/html" template lay-url="product/list/set">
        <div class="layui-form-item">
            <label class="layui-form-label">增幅</label>
            <div class="layui-input-inline">
                <input type="text" name="increase" value="{{ d.data.increase || 0 }}"  autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">%</div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">手续费</label>
            <div class="layui-input-inline">
                <input type="text" name="integral" value="{{ d.data.integral || 0 }}" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">%</div>
        </div>
        </script>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <div class="layui-footer">
                    <input type="button" lay-submit lay-filter="layuiadmin-app-form-submit" value="确认" class="layui-btn">
                </div>
            </div>
        </div>
    </div>

</div>
<script>

    layui.use('layer',function (){
        let $ = layui.$
            ,layer = layui.layer

        $('.wholesale-add').on('click',function (){
            layer.prompt({title: '选项名称'}, function(pass, index){

                let h = '<div class="layui-form-item">' +
                    '<label class="layui-form-label"><i class="layui-icon layui-icon-reduce-circle wholesale-delete" style="color: red;"></i>'+pass+'</label>' +
                    '<div class="layui-input-block">' +
                    '<div class="layui-input-inline" style="width: 100px;">' +
                    '<input type="text" name="wholesale['+pass+'][unit]" value="'+pass+'" placeholder="单位" autocomplete="off" class="layui-input">' +
                    '</div>' +
                    '<div class="layui-form-mid">x</div>' +
                    '<div class="layui-input-inline" style="width: 100px;">' +
                    '<input type="text" name="wholesale['+pass+'][num]" placeholder="基础数量" autocomplete="off" class="layui-input">' +
                    '</div>' +
                    '<div class="layui-input-inline" style="width: 100px;">' +
                    '<input type="text" name="wholesale['+pass+'][price]" placeholder="价格" autocomplete="off" class="layui-input">' +
                    '</div></div></div>';

                $('.wholesale-group').append(h);
                layer.close(index);
            });
        });

        $(document).on('click','.wholesale-delete',function (){
            let t = $(this);
            layer.confirm('确定删除吗？', function(index) {
                t.parents('.layui-form-item:first').remove();
                layer.close(index);
            });

        });
    });

    layui.data.params = function (d){

        layui.use(['form','admin'],function (){
            let $ = layui.$
                ,admin = layui.admin
                ,form = layui.form



            form.on('select(parameters-select)',function (data){
                if (data.value > 0){
                    admin.req({
                        url:'/api/storage/product/parameters/info'
                        ,data:{id:data.value}
                        ,done:function (res){
                            var html = ''
                                ,params = res.data.params


                            $.each(params,function (index,item){

                                html += '<div class="layui-form-item">\n' +
                                    '       <label class="layui-form-label">'+item+'</label>\n' +
                                    '       <div class="layui-input-inline">\n' +
                                    '           <input type="hidden" name="parameter['+item+'][title]" value="'+item+'" class="layui-input">\n' +
                                    '           <input type="text" name="parameter['+item+'][value]" value="" class="layui-input">\n' +
                                    '       </div>\n' +
                                    '    </div>';
                            });
                            $('.parameters-group').html(html);
                        }
                    });
                }

            });
            form.render(null,'layuiadmin-app-form-list');
        });

    }

    layui.data.done = function (d){

        layui.use(['carousel'],function (){
            const $ = layui.$
                ,carousel = layui.carousel;

            let ins = carousel.render({
                elem: '#images-group'
                ,width: '100%' //设置容器宽度
                ,arrow: 'always' //始终显示箭头
                ,autoplay : false
                ,arrow: 'always'
                ,height: '200px'
                //,anim: 'updown' //切换动画方式
            });
            $('#images-url').change(function (){
                let v = $(this).val()
                    ,h = ''
                    ,e = $('#images-group > div:eq(0)');

                h += '<div><input type="hidden" name="image_group[]" value="'+v+'">' +
                    '<img src="'+v+'"></div>';

                e.append(h);
                ins.reload();
            });
            $('.images-delete').on('click',function (){
                let e = ('#images-group');

                $(e).find('.layui-this').remove();
                ins.reload();
            });
        });

    }
</script>
